$(function () {
    window.page = 1
    //默认显示第一页
    var render = function () {
        getCateDate(function (data) {
            console.log(data)
            $('tbody').html(template('list', data))
            // 分页展示
            //初始化分页组件,根据数据
            $('.pagination').bootstrapPaginator({
                // 设置bootstrap对应的版本
                bootstrapMajorVersion: 3,
                // 设置空间显示大小
                size: 'small',
                // 设置当前显示页码
                currentPage: data.page,
                // 一共有多少页
                totalPages: Math.ceil(data.total/data.size),
                // 页码按钮的显示数量，默认是5
                numberOfPages: 3,
                // 点击页码渲染
                // 监听按钮的点击事件，获取点击时的页码
                onPageClicked: function (event, originalEvent, type, page) {
                    //event jquery事件对象
                    //originalEvent 原生dom对象
                    //type 按钮的类型
                    //page当前点击的页码
                    //点击的时候改变window.page的值，再重新渲染
                    window.page = page
                    render()
                }
            })
        })
    }
    render()
    
    // 点击添加显示模态框
    getFirstData(function (data) {
        $('.dropdown-menu').html(template('slideList', data)).on('click','li', function () {
            var categoryName = $(this).html()
            $('.categoryName').html(categoryName)
            var id = $(this).attr('data-id')
            $('[name="categoryId"]').val(id)
        })
    })

    //初始化文件上传插件：
    initFileUpLoad()

    // 点击确认提交，一级分类id，二级分类，品牌logo
    $('.submit').on('click', function (e) {
        //阻止页面跳转的默认事件
        e.preventDefault()
        var message = ''
        // $('.modalCategory').modal('hide')
        var picAddr = $.trim($('[name="brandLogo"]').val())
        var brandName = $.trim($('.secondCategoryName').val())
        var categoryId = $.trim($('[name="categoryId"]').val())
        console.log(categoryId)
        if (categoryId.length == 0) {
            message = '请选择一级分类！'
            $('.alert-danger').remove()
            var html1 = '<div class="alert alert-danger" role="alert">'+message+'</div>'
            $('.message-danger').append(html1)
            return false
        }
        if (brandName.length == 0) {
            message = '请输入二级分类名称！'
            $('.alert-danger').remove()
            var html1 = '<div class="alert alert-danger" role="alert">'+message+'</div>'
            $('.message-danger').append(html1)
            return false
        }
        if (picAddr.length == 0) {
            message = '请上传图片！'
            $('.alert-danger').remove()
            var html1 = '<div class="alert alert-danger" role="alert">'+message+'</div>'
            console.log(html1)
            $('.message-danger').append(html1)
            return false
        }
        $.ajax({
            url: '/category/addSecondCategory',
            type: 'post',
            data: {
                brandName: brandName,
                categoryId: categoryId,
                brandLogo: picAddr,
                hot: 0
            },
            success: function(data) {
                if(data.success == true) {
                    $('.modalCategory').modal('hide')
                    render()
                }
            }
        })
        // var $form = $(e.target);

        // $.ajax({
        //     type:'post',
        //     url:' /category/addSecondCategory',
        //     data:$form.serialize(),
        //     dataType:'json',
        //     success:function (data) {
        //         if(data.success == true){
        //             window.page = 1;
        //             render();
        //             $('#save').modal('hide');
        //         }
        //     }
        // });
    })
})
var getCateDate = function (callback) {
    $.ajax({
        url: '/category/querySecondCategoryPaging',
        type: 'get',
        data: {
            page: window.page  || 1,
            pageSize: 5
        },
        dataType: 'json',
        success: function (data) {
            callback && callback(data)
        }
    })
}
var getFirstData = function (callback) {
    $.ajax({
        url: '/category/queryTopCategoryPaging',
        type: 'get',
        data: {
            page: 1,
            pageSize: 500
        },
        dataType: 'json',
        success: function (data) {
            callback && callback(data)
        }
    })
}
var initFileUpLoad = function () {
    // 初始化上传插件
    $('#fileUpload').fileupload({
        // 文件提交到的地址
        // url: '/category/addSecondCategoryPic',
        //指定后台返回数据类型
        dataType: 'json',
        // 上传成功
        done: function (e, data) {
            window.picAddr = data.result.picAddr
            $('.picture').attr('src', data.result.picAddr)
            $('[name="brandLogo"]').val(data.result.picAddr)
        }
    });
}